<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>图片轮换</title>
<style type="text/css">
a{
	font-size: 14px;
	color: #39F;
	height: 18px;
	width: 20px;
	border: 1px solid #39F;
	text-decoration: none;
	display: block;
	float: left;
	margin-right:5px;
	text-align: center;
	background-color: #FFF;
	line-height: 20px;
}
a:hover {
	font-size: 14px;
	font-weight: bold;
	color: #FFF;
	background-color: #39F;
	border: 1px solid #39F;
	text-decoration: none;
	display: block;
}
#photo3,#photo2,#photo4,#photo5 {
    display:none;
}
#apDiv1 {
	position:absolute;
	width:180px;
	height:25px;
	z-index:2;
	left:100px;
	top: 13px;
}

</style>
<script>
	//1. 要求：实现图片轮换显示，如果没有任何操作，每隔2秒换一张图片。
	//2. 当点击上方的图片索引时，切换到数字对应的那张图片上。
	//--------在此开始你的代码--------------------




	//--------在此结束你的代码--------------------
</script>
</head>

<body>

<table width="360" border="0" cellspacing="0" cellpadding="0">
  <tr>
    <td style="height:190px;"><div id="apDiv1">
    <a href="#">1</a>
    <a href="#">2</a>
    <a href="#">3</a>
    <a href="#">4</a>
    <a href="#">5</a>
    </div>
    <img src="images/1.gif" alt="图片" id="photo"/>
    <img src="images/2.gif" alt="图片" id="photo2"/>
    <img src="images/3.jpg" alt="图片" id="photo3"/>
    <img src="images/4.jpg" alt="图片" id="photo4"/>
    <img src="images/5.gif" alt="图片" id="photo5"/></td>
  </tr>
  </table>


</body>
</html>
